.monaco-editor .margin-view-overlays .line-numbers,
.monaco-editor .margin-view-overlays .myLineDecoration + .line-numbers {
  color: var(--primary-color);
}

.vs .monaco-scrollable-element > .scrollbar > .slider {
  z-index: 11;
}

.editor-container {
  background: var(--editor-background);
}

.breadcrumbs-demo {
  font-size: 16px;
  margin: 0 0 1.2rem;
}

.tabs-row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.action-row button {
  padding: 4px 16px;
}

.active-tab {
  border-color: var(--secondary-color);
  background-color: var(--secondary-color);
  color: var(--secondary-background);
}

.editor-upper-jaw,
.editor-lower-jaw {
  padding: 15px 15px 15px 0px;
}

.action-row-container,
.description-container {
  background-color: var(--secondary-background);
  padding: 10px;
  border: 2px solid var(--tertiary-background);
  max-width: 700px;
}

.description-highlighter {
  background-color: var(--secondary-background);
  opacity: 1;
  animation-name: example;
  animation-duration: 2s;
  animation-delay: 0.5s;
}

@keyframes example {
  from {
    background-color: var(--highlight-background);
  }
  to {
    background-color: var(--secondary-background);
  }
}

#description p:last-child {
  margin: 0px;
}

#test-status {
  padding-bottom: 5px;
  padding-top: 5px;
}

.myEditableLineDecoration {
  background-color: var(--gray-45);
  width: 15px !important;
  margin-left: 5px !important;
  margin-right: 5px !important;
}

.myEditableLineDecoration.tests-passed {
  background-color: #4caf50;
}

.editable-region {
  background-color: var(--primary-background);
  z-index: -1;
}
